<template>
  <div id="questionBank">
    <el-row class="question-all" type="flex">
      <el-col :span="18" :push="3">
        <div class="question-body">
          <el-row type="flex" justify="start">
            <el-col :span="2" push="1">
              <el-button class="add-btn" type="primary" size="small" icon="el-icon-plus">添加题目</el-button>
            </el-col>
          </el-row>
          <el-row class="quest-search" type="flex" justify="start" gutter="5">
            <el-col offset=1 :span="4">
              <el-input  size="small" placeholder="请输入筛选的课程名称"></el-input>
            </el-col>
            <el-col :span="4">
              <el-input size="small" placeholder="请输入筛选的知识名称"></el-input>
            </el-col>
            <el-col :span="4">
              <el-input size="small" placeholder="请输入筛选的题目名称"></el-input>
            </el-col>
            <el-col :span="3">
              <el-select size="small" v-model="value" placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
            </el-col>
            <el-col :span="2">
              <el-button type="primary" icon="el-icon-search" size="small">搜索</el-button>
            </el-col>
          </el-row>
          <el-row class="quest-sort" type="flex" justify="start">
            <el-col :span="5">
              <span>排序：</span><el-tag effect="dark" size="mini">正确率</el-tag>&nbsp;<el-tag effect="dark" size="mini">抽中次数</el-tag>
            </el-col>
          </el-row>
          <el-row class="quest-divi" type="flex" align="middle" justify="start">
            <el-col offset=1 :span="1">
              <i class="fa fa-tag" aria-hidden="true"></i>
            </el-col>
            <el-col :span="21">
              <el-divider content-position="left">少年包青天</el-divider>
            </el-col>
          </el-row>
          <el-row type="flex" justify="start">
            <el-col offset="1" :span="22">
              <el-table border style="width: 100%">
                <el-table-column type="expand">
                  <template></template>
                </el-table-column>
                 <el-table-column label="题目名称" width="150"></el-table-column>
                 <el-table-column label="所属课程" width="150"></el-table-column>
                 <el-table-column label="所属知识点" width="150"></el-table-column>
                 <el-table-column label="设为题库概念题" width="150"></el-table-column>
                 <el-table-column label="设为题库课前练习题" width="150"></el-table-column>
                 <el-table-column label="更新人" width="150"></el-table-column>
                 <el-table-column label="更新时间" width="150"></el-table-column>
                 <el-table-column fixed="right" label="操作" align="center" width="150">
                   <template slot-scope="scope">
                     <el-button type="primary" size="mini">编辑</el-button>
                     <el-button type="danger" size="mini">删除</el-button>
                   </template>
                 </el-table-column>
              </el-table>
              <el-row type="flex" justify="center">
                <el-pagination
                  background
                  @size-change="handleSizeChange"
                  @current-change="handleCurrentChange"
                  :current-page="currentPage4"
                  :page-sizes="[10, 50, 100, 200]"
                  :page-size="page_size"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="total">
                </el-pagination>
              </el-row>
            </el-col>
          </el-row>
        </div>
      </el-col>
    </el-row>
  </div>
</template>
<script>
export default {
  data () {
    return {
      options: [{
        value: '1',
        label: '全部'
      }, {
        value: '2',
        label: '单选'
      }, {
        value: '3',
        label: '多选题'
      }]
    }
  },
  components: {

  },
  computed: {

  },
  methods: {

  },
  mounted () {

  }
}
</script>

<style scoped="scoped">
  @import url("../assets/css/questionCSS.css");
</style>
